import React from 'react';
import { inject, observer } from 'mobx-react';
import { Button } from 'antd';
import { toJS } from 'mobx';
import { Condition, getAdButtons } from './list/listCondition';
import { WeaTableNew } from 'comsMobx';

const WeaTable = WeaTableNew.WeaTable;
import { WeaRightMenu, WeaTop, WeaTab, WeaErrorPage, WeaTools, WeaAlertPage, WeaDialog, WeaLocaleProvider } from 'ecCom';

const getLabel = WeaLocaleProvider.getLabel;

@inject('contacterQueryStore')
@observer
class ContacterQueryResult extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      visibleSms: false,
      tempContacterId: '',
      smsLoaded: false,
    };
  }
  componentDidMount() {
    this.doInit(this.props);
    if (window.weaSmallApp) {
      this.setState({ smsLoaded: true });
    } else if (!window.weaSmallApp) {
      eventRegister.loadModule('f_smallApp', () => {
        this.setState({ smsLoaded: true });
      }, () => {
        alert('加载短信模块失败，请联系系统管理员！');
      });
    }
  }
  doInit(props) {
    const { location, contacterQueryStore } = props;
    const { initDatas, doSearch, inited } = contacterQueryStore;
    if (!inited) {
      initDatas();
    }
    doSearch();
  }
  componentWillReceiveProps(nextProps) {
    const keyOld = this.props.location.key;
    const keyNew = nextProps.location.key;
    // 点击菜单路由刷新组件
    if (keyOld !== keyNew) {
      const { contacterQueryStore } = nextProps;
      const { initDatas, doSearch } = contacterQueryStore;
      contacterQueryStore.clearStatus();
      // initDatas();
      doSearch();
    }
  }
  componentWillUnmount() {
    const { contacterQueryStore } = this.props;
    contacterQueryStore.clearStatus();
  }
  render() {
    const { contacterQueryStore } = this.props;
    let { title, loading, tableStore, showSearchAd, form, verified, hasRight, reLoad, tempContacterId } = contacterQueryStore;
    title = getLabel(32731, '查询联系人');
    // const formParams = form.getFormParams() || {};
    return (
      <div>
        <WeaRightMenu
          ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@ly4517`}
          datas={this.getRightMenu()}
          onClick={this.onRightMenuClick}
          collectParams={{
            favname: title,
            favouritetype: 4,
            importantlevel: 1,
            objid: -1,
          }}
        >
          <WeaTop
            ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@nb6yz9`}
            title={title}
            loading={loading}
            icon={<i className="icon-coms-crm" />}
            iconBgcolor="#96358a"
            buttons={[]}
            buttonSpace={10}
            showDropIcon
            dropMenuDatas={this.getRightMenu()}
            onDropMenuClick={this.onRightMenuClick}
          >
            <WeaTab
              ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@cr4er0`}
              buttonsAd={getAdButtons(contacterQueryStore, this.props.ecId || '')}
              searchType={['base', 'advanced']}
              searchsBaseValue={form.getFormParams().firstname}
              setShowSearchAd={this.setShowSearchAd }
              hideSearchAd={this.setShowSearchAd}
              searchsAd={
                <div><Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@7b1alb`} listStore={contacterQueryStore} form={form} onEnterSearch={this.onEnterSearch} /></div>
              }
              showSearchAd={showSearchAd}
              onSearch={this.onSearch}
              onSearchChange={this.onSearchChange}
            />
            <WeaTable
              ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@nfxmfl`}
              comsWeaTableStore={tableStore}
              hasOrder
              needScroll
              register_table={reLoad}
              onOperatesClick={this.onOperatesClick}
            />
          </WeaTop>
        </WeaRightMenu>

        <WeaDialog
          ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@zvyt0f`}
          visible={this.state.visibleSms}
          title={getLabel(125977, '发送短信')}
          icon="icon-coms-message"
          style={{ width: 800, height: 500 }}
          onCancel={() => this.setState({ visibleSms: false })}
        >
          {this.state.smsLoaded && window.weaSmallApp && window.weaSmallApp.com && window.weaSmallApp.com.SendSms && this.state.visibleSms && <window.weaSmallApp.com.SendSms ecId={`${this && this.props && this.props.ecId || ''}_undefined@540vfh`} isCus crm={this.state.tempContacterId} />}

        </WeaDialog>
      </div>
    );
  }
  getRightMenu() {
    const { doSearch, onShowColumn } = this.props.contacterQueryStore;
    const btns = [];
    btns.push({
      icon: <i className="icon-coms-search" />,
      content: getLabel(197, '搜索'),
      key: 0,
    });
    btns.push({
      icon: <i className="icon-coms-Custom " />,
      content: getLabel(382660, '显示定制列'),
      key: 1,
    });
    return btns;
  }

  onRightMenuClick=(key)=> {
    const { doSearch, onShowColumn } = this.props.contacterQueryStore;
    if (key == '0') {
      doSearch();
    } else if (key == '1') {
      onShowColumn();
    }
  }

  onOperatesClick=(record, index, operate, flag)=> {
    const _href = operate && operate.href ? operate.href : '';
    const fn = _href.replace('javascript:', '');
    if (flag == '2') { // 发送短信
      this.setState({ visibleSms: true, tempContacterId: record.randomFieldId });
    }
    if (flag == '3') { // 查看
      openFullWindowHaveBarForCrm(`/main/crm/contacterView?contacterId=${record.randomFieldId}`);
    }
  }

  setShowSearchAd=(bl) => {
    const { contacterQueryStore } = this.props;
    contacterQueryStore.setShowSearchAd(bl);
  }

  onSearchChange=(v) => {
    const { location, params, contacterQueryStore } = this.props;
    if (contacterQueryStore.form.has('firstname')) {
      contacterQueryStore.appendFormFields({ firstname: { value: v } });
    } else {
      contacterQueryStore.form.add(v, { key: 'firstname' });
    }
  }

  onSearch=(v) => {
    const { location, contacterQueryStore } = this.props;
    contacterQueryStore.doSearch(location.query);
    contacterQueryStore.setShowSearchAd(false);
  }

  onEnterSearch=() => {
    const { contacterQueryStore } = this.props;
    contacterQueryStore.doSearch();
    contacterQueryStore.setShowSearchAd(false);
  }
}

export default WeaTools.tryCatch(React,
  props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@y2z3vv`} msg={props.error ? props.error : getLabel(129417, '服务器运行出错，请联系系统管理员！')} />,
  { error: '' },
)(ContacterQueryResult);
